<template>
  <div class="r-management-box page-miH page-bgBack">
    <a-tabs :activeKey="isCancel" @change="change">
      <a-tab-pane key="2" tab="在招职位" />
      <a-tab-pane key="1" tab="已关闭职位" />
    </a-tabs>
    <tables :isCancel="isCancel" />
  </div>
</template>

<script>
import tables from "./component/table";
export default {
  components: {
    tables
  },
  data() {
    return {
      isCancel: "2"
    };
  },
  created() {
    if (this.$store.state.recruitment.isCancel) {
      this.isCancel = this.$store.state.recruitment.isCancel;
      if (this.isCancel === "2") this.$store.commit("recruitment/isCancel", null);
    }
  },
  methods: {
    change(v) {
      this.isCancel = v;
      this.$store.commit("recruitment/isCancel", v);
    }
  }
};
</script>

<style lang="scss" scoped>
.r-management-box {
  padding: 0 24px 24px 24px;
  position: relative;

  .r-management-action {
    position: absolute;
    width: calc(100% - 320px);
    height: 10px;
    right: 24px;
    top: 32px;
    display: flex;
    justify-content: space-between;
  }
  ::v-deep.ant-tabs-tab {
    line-height: 60px;
    padding-top: 0px;
    height: 60px;
  }
  ::v-deep.ant-tabs-bar {
    margin-bottom: 24px !important;
  }
}
</style>
